<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">
		<meta name="theme-color" content="#000000">
		<meta name="renderer" content="webkit">
		<meta name="google" content="notranslate">
		<meta name="format-detection" content="telephone=no">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>枫之谷M国际服</title>
		<!-- bootstrap4 -->
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
		 crossorigin="anonymous">
		
		<link type="text/css" href="css/bootstrap.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/normalize.css" />
		<link rel="stylesheet" type="text/css" href="css/demo.css">
		<script src="js/bootstrap.min.js"></script>
		<script src="js/jquery.min.js"></script>
		<style type="text/css">
			.lllaa {
				/* 测试提交 */
			}
			body_content {
				min-width: 1000px;
				max-width: 2000px;
			}

			video::-webkit-media-controls {
				display: none !important;
			}

			* {
				margin: 0;
				padding: 0
			}

			li {
				list-style: none
			}

			/* 测试提交代码 */
			.test {
				font-size: 20px;
			}

			img {
				vertical-align: top;
				border: none
			}

			.left-ul {
				padding: 0;
				margin: 0;
				border: 0;
				list-style-type: none;

			}

			.left-ul li {
				align-items: center;
				width: 100%;
				padding-top: 0.3125rem;
				padding-bottom: 0.3125rem;
			}

			.logo {
				height: 9.375rem;
				text-align: center;
				line-height: 9.375rem;
			}

			.logo a {
				display: inline-flex;
				height: 2.8125rem;
				align-items: center;
				line-height: 2.8125rem;
			}

			.top {
				/* 设置宽度高度背景颜色 */
				height: 6.25rem;
				;
				width: 100%;
				text-align: center;
				/* border-bottom: 3px solid #FFFFFF; */
			}

			.top_list {
				width: 100%;
				height: 20rem;
			}

			.top_bk {
				position: absolute;
				top: 0;
				width: 100%;
				height: auto;
			}

			.ganmeDownload {
				width: 100%;
				height: auto;
				margin-bottom: 0.625rem;
			}

			.ganmeDownload a {
				display: block;
				text-align: center;
				width: 100%;
				height: auto;
				position: relative;

			}

			.ganmeDownload a span {
				position: absolute;
				left: 0px;
				z-index: 99999;
				width: 100%;
				text-align: center;
			}

			.ganmeDownload a:hover .gameDown,
			.ganmeDownload a:focus .gameDown {
				letter-spacing: 0.25rem;
			}

			.ganmeDownload a:hover .down,
			.ganmeDownload a:focus .down {
				letter-spacing: 0.25rem;
			}

			.gameDown {
				font-weight: 600;
				-webkit-transition: 0.8s;
				transition: 0.8s;
				top: 4.7rem;
				font-size: 1.875rem;
			}

			.down {
				-webkit-transition: 0.8s;
				transition: 0.8s;
				top: 7.2rem;
				font-size: 0.8rem;
			}

			.list_4 {
				text-align: center;
				margin: 0 auto;
				width: 100%;
				height: 80px;
				line-height: 80px;
				background: url(images/sprites-repeat.png) 0 0 repeat-x;
				margin-bottom: 2px;
				-webkit-transition: 0.5s;
				transition: 0.5s;
			}

			.list_4:hover,
			.list_4:focus {
				background: url(images/sprites-repeat.png) 0 -80px repeat-x;
			}
		</style>
		<style type="text/css">
			html,
			* {
				margin: 0;
				padding: 0;
			}

			body {

				background-image: linear-gradient(120deg, #fccb90 0%, #d57eeb 100%);
			}

			/*去除a标签点击后出现的虚线框*/
			a {
				outline: none;
			}

			a:hover {
				outline: none;
			}

			a:focus {
				outline: none;
			}

			a:active {
				outline: none;
			}

			.header-navigation {
				position: relative;
				top: 0;
				width: 100%;
				height: 4rem;
				line-height: 4rem;
				background-color: rgba(0, 0, 0, 0.4);
				text-align: center;
				box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
				z-index: 9999;
				-webkit-transition: 0.8s;
				transition: 0.8s;
			}

			.header-navigation:hover,
			.header-navigation:focus {
				height: 25rem;
				background-color: rgba(0, 0, 0, 0.55);
			}

			.link {
				color: #fff;
				text-decoration: none;
				margin: 0 30px;
			}

			h1 {
				text-align: center;
				margin-top: 170px;
				margin-bottom: 50px;
				color: #fff;
			}

			/* Slide transitions */

			.slideUp {
				/* -webkit-transform: translateY(-100px);
			  transform: translateY(-100px);*/
				-webkit-transform: translateY(-100px);
				-ms-transform: translateY(-100px);
				-o-transform: translateY(-100px);
				transform: translateY(-100px);
				/*transition: transform .5s ease-out;*/
				-webkit-transition: transform .5s ease-out;
				-o-transition: transform .5s ease-out;
				transition: transform .5s ease-out;
			}

			.slideDown {
				/*-webkit-transform: translateY(0);
			  transform: translateY(0);*/
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				-o-transform: translateY(0);
				transform: translateY(0);
				/*transition: transform .5s ease-out;*/
				-webkit-transition: transform .5s ease-out;
				-o-transition: transform .5s ease-out;
				transition: transform .5s ease-out;
			}
		</style>
	</head>
	</head>
	<body style="height: 75rem;">
		<div class="container-fluid" style="height: 156.25rem;min-width: 93.75rem;max-width: 156.25rem;">
			<div class="row" style="">
				<div class="col-md-2 " style="background-image: ;background-color: #DD3A1F; height: 156.25rem; padding: 0;">
					<ul class="left-ul" style="display: block;">
						<li class="logo"><a href="#"><img src="images/logo.png"></a></li>
						<li class="ganmeDownload" style="position: relative;">
							<a href="#">
								<video src="./video/v-download.mp4" width="100%" height="auto" autoplay loop></video>
								<span class="gameDown">游戏下载</span>
								<span class="down">DOWNLOAD</span>
							</a>
						</li>
					</ul>
					<span style=" padding-top: 0.625rem; display: block;">测试阶段的广告栏位置</span>
					<ul class="left-ul" style="width: 100%; margin-top: 0.625rem;display:inline-block;background-color: #BF280F;">
						<li class="" style="text-align: center; width: 50%; padding:19% 0 19% 0; float: left; border-right:0.03125rem solid #DD3A1F; border-bottom:0.03125rem solid #DD3A1F ;">A</li>
						<li class="" style="text-align: center;width: 50%; padding:19% 0 19% 0; float: left; border-left:0.03125rem solid #DD3A1F; border-bottom:0.03125rem solid #DD3A1F ;">B</li>
						<li class="" style="text-align: center;width: 50%; padding:19% 0 19% 0; float: left; border-right:0.03125rem solid #DD3A1F; border-top:0.03125rem solid #DD3A1F ;">C</li>
						<li class="" style="text-align: center;width: 50%; padding:19% 0 19% 0; float: left; border-left:0.03125rem solid #DD3A1F;  border-top:0.03125rem solid #DD3A1F ;">D</li>

					</ul>
					<ul class="left-ul" style="width: 100%;margin-top: 0.625rem; margin-bottom: 0.625rem ;">
						<li class="" style="text-align: center; margin:0 auto; width: 95%; height: 9.375rem;line-height: 9.375rem;border:4px solid #C42D14; margin-bottom: 0.5rem;">A</li>
						<li class="" style="text-align: center; margin:0 auto; width: 95%; height: 9.375rem;line-height: 9.375rem;border:4px solid #C42D14; margin-top: 0.5rem">B</li>
					</ul>
					<ul class="left-ul" style="width: 100%;margin-top: 0.625rem; height: 12.5rem;">
						<li class="list_4">A</li>
						<li class="list_4">B</li>
						<li class="list_4">C</li>
						<li class="list_4">D</li>
					</ul>
				</div>
				<div class="col-md-10 " style="height: 180px;padding:0; ">
					<div class="top">
						<header class="header-navigation" id="header" onmouseover="javascript:dropDown()" onmouseout="javascript:out();">
							<nav>
								<a class="link" href="#" title="Home" onmouseover="javascript:checkFlag(this);">首页</a>
								<a class="link" href="#" title="game" onmouseover="javascript:checkFlag(this);">游戏资料</a>
								<a class="link" href="#" title="game" onmouseover="javascript:checkFlag(this);">玩家互动</a>
								<a class="link" href="#" title="game" onmouseover="javascript:checkFlag(this);">游戏论坛</a>
								<a class="link" href="#" title="game" onmouseover="javascript:checkFlag(this);">账号管理</a>
								<a class="link" href="#" title="About" onmouseover="javascript:checkFlag(this);">关于我们</a>
							</nav>
							<div class="top_list" style="display: none;">

								<nav>
									<div class="link" style="width:2.5rem;font-size:e0.5rem;font-weight: 500;display: inline-block;">
									</div>
									<div class="link" style="width:5rem;font-size: 0.9rem;font-weight: 500;display: inline-block;">

										<ul style="margin-top:0.625rem;">
											<li style="height: 2rem;line-height: 2rem;"><a href="#">游戏下载</a></li>
											<li style="height: 2rem;line-height: 2rem;"><a href="#">测试仪啊</a></li>
										</ul>

									</div>
									<div class="link" style="width:5rem;font-size: 0.9rem;font-weight: 500;display: inline-block;">
										<ul style="margin-top:0.625rem;">
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
										</ul>
									</div>
									<div class="link" style="width:5rem;font-size: 0.9rem;font-weight: 500;display: inline-block;">
										<ul style="margin-top:0.625rem;">
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
										</ul>

									</div>
									<div class="link" style="width:5rem;font-size: 0.9rem;font-weight: 500;display: inline-block;">
										<ul style="margin-top:0.625rem;">
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
										</ul>
									</div>
									<div class="link" style="width:5rem;font-size: 0.9rem;font-weight: 500;display: inline-block;">
										<ul style="margin-top:0.625rem;">
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
											<li style="height: 2rem;line-height: 2rem;">测试仪啊</li>
										</ul>
									</div>
								</nav>
							</div>
						</header>

						<div id="flag" style="position:absolute;top:3rem;z-index:99999;"><img src="images/flag.png"></div>
					</div>


					<div class="center-block">
						<!--背景图-->
						<div class="top_bk">
							<img src="images/maplestory-013.jpg" style="width: 100%;">
						</div>
						<!-- 轮播图 -->
						<div id="carouselExampleIndicators" class="carousel slide center-block" data-ride="carousel">
							<ol class="carousel-indicators">
								<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
								<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
								<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
							</ol>
							<div class="carousel-inner">
								<div class="carousel-item active">
									<img src="images/maplestory-012.jpg" class="d-block w-100" alt="...">
								</div>
								<div class="carousel-item">
									<img src="images/maplestory.jpg" class="d-block w-100" alt="...">
								</div>
								<div class="carousel-item">
									<img src="images/maplestory-012.jpg" class="d-block w-100" alt="...">
								</div>
							</div>
							<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
								<span class="carousel-control-prev-icon" aria-hidden="true"></span>
								<span class="sr-only">Previous</span>
							</a>
							<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
								<span class="carousel-control-next-icon" aria-hidden="true"></span>
								<span class="sr-only">Next</span>
							</a>
						</div>
						<!-- 轮播图上的卡片 -->
						<div class="w-box">
							<div class="gradient-shadow__hover">
								<div class="w-content container-fluid">
									<!-- 卡片上的导航 -->
									<ul class="nav">
										<li role="presentation" class="active panel"><a href="#">最新</a></li>
										<li role="presentation" class="panel"><a href="#">活动</a></li>
										<li role="presentation" class="panel"><a href="#">公告</a></li>
										<li role="presentation" class="panel"><a href="#">焦点</a></li>
									</ul>
									<!-- 卡片上的头条 -->
									<div class="panel panel-default">
										<div class="panel-heading">
											XXXXXXXXXX
										</div>
									</div>

									<!-- 卡片上的列表组 -->
									<div class="list-group list-group-flush">
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small>3 days ago</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small class="text-muted">3 days ago</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small class="text-muted">3 days ago</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small>3 days ago</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small>3 days ago</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small>3 days ago</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">List group item heading</h5>
												<small>3 days ago</small>
											</div>
										</a>
									</div>

									<button type="button" class="btn btn-lg center-block">
										<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
									</button>

								</div>
							</div>
							<!-- 小标标 -->
							<div id="flag1" style="position:absolute;top:37rem;z-index:99999;right: 35rem;"><img src="images/flag.png"></div>

							<!-- 轮播图下的板块 -->
							<div class="message-card">
								<div class="d-flex s-text">
									<h2>GM专栏</h2>
									<small>查看更多+</small>
								</div>

								<div class="media">
									<div class="media-left">
										<a href="#">
											<img class="media-object" src="./images/maplestory.jpg" alt="..." style="width: 150px;height: 125px;margin-left: 4rem;" />
										</a>
									</div>
									<div class="media-body">
										<h3 class="media-heading">标题1</h3>
										<h5>内容内容内容内容内容内容1</h5>
										<h4>标题2</h4>
										<h5>内容内容内容内容内容内容2</h5>
									</div>
								</div>
								<!-- 下面的一部分 -->
								<div class="two">
									<h3 style="width: 2.5rem;font-size: 2.5rem;word-wrap: break-word;letter-spacing: 1.25rem;">XXXX</h3>
								</div>
								<!-- 小标标(未调) -->
								<div id="flag1" style="position:absolute;top:37rem;z-index:99999;right: 35rem;"><img src="images/flag.png"></div>

								<div class="kuang">
									<h3 class="new-text">XX专栏</h3>
									<div class="panel panel-info">
										<div class="panel-heading ">
											标题标题标题标题标题3
										</div>
									</div>
									<div class="list-group list-group-flush">
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">【专栏】XXXXX | List group item heading</h5>
												<small>06-18</small>
											</div>
										</a>
										<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
											<div class="d-flex w-100 justify-content-between">
												<h5 class="mb-1">【专栏】XXXXX | List group item heading</h5>
												<small class="text-muted">06-18</small>
											</div>
										</a>
									</div>
									<!-- 竖向列表（之后再琢磨吧。。。） -->
									<dl>
										<dd>
											<a class="shu list-group" href="#">
												<span class="shu-text1 list-group-item">biu</span>
											</a>
										</dd>
										<dd>
											<a class="shu" href="">
												<span class="shu-text2 list-group-item">biu</span>
											</a>
										</dd>
										<dd>
											<a class="shu" href="">
												<span class="shu-text3 list-group-item">biu</span>
											</a>
										</dd>
									</dl>

								</div>
								<!-- 轮播图下右上边的板块 -->
								<div class="right-top-card">
									<div class="media">
										<div class="media-body">
											<h2 class="media-heading text-center">Media heading</h2>
											<div class="media-body1">
												<a href="#">活动1</a> |
												<a href="#">活动2</a> |
												<a href="#">活动3</a>
											</div>
										</div>
										<div class="media-right">
											<a href="#">
												<img class="media-object" src="images/maplestory.jpg" alt="..." style="width: 135px; height: 135px;">
											</a>
										</div>
									</div>
								</div>
								<!-- 轮播图下右下边的板块 -->
								<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
									<ol class="carousel-indicators">
									    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active">事件1</li>
									    <li data-target="#carouselExampleIndicators" data-slide-to="1">事件2</li>
									    <li data-target="#carouselExampleIndicators" data-slide-to="2">事件3</li>
									</ol>
									<div class="carousel-inner">
										<div class="carousel-item active">
											<img src="images/maplestory-012.jpg" class="d-block w-100" alt="...">
										</div>
										<div class="carousel-item">
											<img src="images/maplestory-013.jpg" class="d-block w-100" alt="...">
										</div>
										<div class="carousel-item">
											<img src="images/maplestory.jpg" class="d-block w-100" alt="...">
										</div>
									</div>
								</div>
								<!-- 监听小轮播图(没写js) -->
								<!-- <div class="right-bottom-card">
									<span>事件1</span> | <span>事件2</span> | <span>事件3</span>
								</div> -->

							</div>
							<!-- 倒数第三个板块 -->
							<div class="three-menu">
									<h2>XX介绍</h2>
								<!-- 小导航 -->
								<ul class="nav nav-tabs anniu" id="myTab" role="tablist">
								  <li class="nav-item">
								    <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
								  </li>
								  <li class="nav-item">
								    <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
								  </li>
								</ul>
								
								<!-- 小导航里面的导航 -->
								<div class="tab-content" id="myTabContent">
								  <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
									  
									  
									  <ul class="nav nav-tabs tabs1 anniu1" id="myTab" role="tablist">
									    <li class="nav-item">
									      <a class="nav-link active" id="a-tab" data-toggle="tab" href="#a" role="tab" aria-controls="a" aria-selected="true">Home</a>
									    </li>
									    <li class="nav-item">
									      <a class="nav-link" id="b-tab" data-toggle="tab" href="#b" role="tab" aria-controls="b" aria-selected="false">Profile</a>
									    </li>
										<li class="nav-item">
										  <a class="nav-link" id="c-tab" data-toggle="tab" href="#c" role="tab" aria-controls="c" aria-selected="false">Home</a>
										</li>
										<li class="nav-item">
										  <a class="nav-link" id="d-tab" data-toggle="tab" href="#d" role="tab" aria-controls="d" aria-selected="false">Profile</a>
										</li>
										<li class="nav-item">
										  <a class="nav-link" id="e-tab" data-toggle="tab" href="#e" role="tab" aria-controls="e" aria-selected="false">Home</a>
										</li>
										<li class="nav-item">
										  <a class="nav-link" id="f-tab" data-toggle="tab" href="#f" role="tab" aria-controls="f" aria-selected="false">Profile</a>
										</li>
										<li class="nav-item">
										  <a class="nav-link" id="g-tab" data-toggle="tab" href="#g" role="tab" aria-controls="g" aria-selected="false">Home</a>
										</li>
										<li class="nav-item">
										  <a class="nav-link" id="h-tab" data-toggle="tab" href="#h" role="tab" aria-controls="h" aria-selected="false">Profile</a>
										</li>
										<li class="nav-item">
										  <a class="nav-link" id="i-tab" data-toggle="tab" href="#i" role="tab" aria-controls="i" aria-selected="false">Home</a>
										</li>
									  </ul>
									  <div class="tab-content" id="myTabContent">
									    <div class="tab-pane fade show active" id="a" role="tabpanel" aria-labelledby="a-tab">
											
											<!-- 图文1 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="images/top.jpeg" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									    <div class="tab-pane fade" id="b" role="tabpanel" aria-labelledby="b-tab">
											
											<!-- 图文2 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="c" role="tabpanel" aria-labelledby="c-tab">
											
											<!-- 图文3 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="d" role="tabpanel" aria-labelledby="d-tab">
											
											<!-- 图文4 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="e" role="tabpanel" aria-labelledby="e-tab">
											
											<!-- 图文5 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="f" role="tabpanel" aria-labelledby="f-tab">
											
											<!-- 图文6 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="g" role="tabpanel" aria-labelledby="g-tab">
											
											<!-- 图文7 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="h" role="tabpanel" aria-labelledby="h-tab">
											
											<!-- 图文8 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
										<div class="tab-pane fade" id="i" role="tabpanel" aria-labelledby="i-tab">
											
											<!-- 图文9 -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  </div>
									  
									  
								  </div>
								  
								  
								  <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
									  
									  
									  <ul class="nav nav-tabs tabs1 anniu1" id="myTab" role="tablist">
									    <li class="nav-item">
									      <a class="nav-link active" id="j-tab" data-toggle="tab" href="#j" role="tab" aria-controls="j" aria-selected="true">Home</a>
									    </li>
									    <li class="nav-item">
									      <a class="nav-link" id="k-tab" data-toggle="tab" href="#k" role="tab" aria-controls="k" aria-selected="false">Profile</a>
									    </li>
										<li class="nav-item">
									  		<a class="nav-link" id="r-tab" data-toggle="tab" href="#r" role="tab" aria-controls="r" aria-selected="false">Home</a>
									  	</li>
									  	<li class="nav-item">
											<a class="nav-link" id="m-tab" data-toggle="tab" href="#m" role="tab" aria-controls="m" aria-selected="false">Profile</a>
										</li>
										<li class="nav-item">
											<a class="nav-link" id="n-tab" data-toggle="tab" href="#n" role="tab" aria-controls="n" aria-selected="false">Home</a>
										</li>
										<li class="nav-item">
											<a class="nav-link" id="o-tab" data-toggle="tab" href="#o" role="tab" aria-controls="o" aria-selected="false">Profile</a>
										</li>
										<li class="nav-item">
											<a class="nav-link" id="p-tab" data-toggle="tab" href="#p" role="tab" aria-controls="p" aria-selected="false">Home</a>
										</li>
										<li class="nav-item">
											<a class="nav-link" id="q-tab" data-toggle="tab" href="#q" role="tab" aria-controls="q" aria-selected="false">Profile</a>
										</li>
									  </ul>
									  
									  <div class="tab-content" id="myTabContent">
									    <div class="tab-pane fade show active" id="j" role="tabpanel" aria-labelledby="j-tab">
											
											<!-- 图文a -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									    <div class="tab-pane fade" id="k" role="tabpanel" aria-labelledby="k-tab">
											
											<!-- 图文b -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  	<div class="tab-pane fade" id="l" role="tabpanel" aria-labelledby="l-tab">
											
											<!-- 图文c -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  	<div class="tab-pane fade" id="m" role="tabpanel" aria-labelledby="m-tab">
											
											<!-- 图文d -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  	<div class="tab-pane fade" id="n" role="tabpanel" aria-labelledby="n-tab">
											
											<!-- 图文e -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  	<div class="tab-pane fade" id="o" role="tabpanel" aria-labelledby="o-tab">
											
											<!-- 图文f -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  	<div class="tab-pane fade" id="p" role="tabpanel" aria-labelledby="p-tab">
											
											<!-- 图文g -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  	<div class="tab-pane fade" id="q" role="tabpanel" aria-labelledby="q-tab">
											
											<!-- 图文h -->
											<div class="k-box">
												<div class="l-text">
													<span class="wz">小标</span><!-- 左边的 -->
													
												</div>
												<div class="r-text">
													<span class="wz">小标</span><!-- 右边的 -->
													
												</div>
												<div class="pto-mi">
													<img class="dw" src="" alt="" /><!-- 图片 -->
												</div>
												<ul class="shu-t"><!-- 解释文字 -->
													<li>bibibibi</li>
													<li>bibibibi</li>
												</ul>
												<div class="mi-wz">
													<div class="i-c">
														<span>  </span>
														<span>  </span>
													</div>
													<span class="d-wz">AA</span>
													<span class="x-x"></span><!-- 一条线 -->
													<span class="glyphicon glyphicon-circle-arrow-right" aria-hidden="true"></span>
												</div>
											</div>
											
										</div>
									  </div>
									  
									  
								  </div>
								</div>
								
								
				
								
								
								
								
								
								<!-- <div class="l-nav" style="display:block;">
									<div class="btn-group" role="group" aria-label="...">
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									  <button type="button" class="btn btn-default">G</button>
									</div>
									<div class="btn-group1" ></div>
								</div> -->
								
								
				
								
							</div>

							<!-- 倒数第二个模块 -->
							<div class="four mb-4">
								<div class="l-kuang">
									<div class="four-menu">
										<h2>XX出品</h2>
										<div class="btn-group anniu2" role="toolbar" aria-label="...">
										  <button type="button" class="btn btn-default" href="#">CCC</button>
										</div>
										<div class="btn-group anniu3" role="group" aria-label="...">
										  <button type="button" class="btn btn-default" href="#">CCC</button>
										</div>
									</div>
									<ul class="video">
										<!-- 视频1 -->
										<li>
											<h3><strong>视频标题1</strong></h3>
											<div class="mi-z">
												<p>小字部分</p>
												<p>咕咕咕</p>
											</div>
											<div class="sp-tp">
												<a href=""><!-- 视频链接 -->
													<img src="" alt="" />
													<img class="tp-mb" src="" alt="" /><!-- 图片上层 -->
													<!-- 图片上的文字跟线 -->
													<p>主标
														<span class="line"></span>
													</p>
												</a>
											</div>
										</li>
										<!-- 视频2 -->
										<li>
											<h3><strong>视频标题1</strong></h3>
											<div class="mi-z">
												<p>小字部分</p>
												<p>咕咕咕</p>
											</div>
											<div class="sp-tp">
												<a href=""><!-- 视频链接 -->
													<img src="" alt="" />
													<img class="tp-mb" src="" alt="" /><!-- 图片上层 -->
													<!-- 图片上的文字跟线 -->
													<p>主标
														<span class="line"></span>
													</p>
												</a>
											</div>
										</li>
										<!-- 视频3 -->
										<li>
											<h3><strong>视频标题1</strong></h3>
											<div class="mi-z">
												<p>小字部分</p>
												<p>咕咕咕</p>
											</div>
											<div class="sp-tp">
												<a href=""><!-- 视频链接 -->
													<img src="" alt="" />
													<img class="tp-mb" src="" alt="" /><!-- 图片上层 -->
													<!-- 图片上的文字跟线 -->
													<p>主标
														<span class="line"></span>
													</p>
												</a>
											</div>
										</li>
										
									</ul>
								</div>
								
								<div class="r-zb">
									<div class="r-bt">
										<h2>官方XXX</h2>
										<p>bibibibibi</p>
										<a class="a-n" href="">招募</a>
									</div>
									<div class="x-bt">
										<span>今日推荐</span>
									</div>
									<ul class="r-x-list">
										<!-- X1 -->
										<li>
											<h3>MMM</h3>
											<p class="i">
												<span></span>热度：12345
											</p>
											<a class="r-x-btn" href="">正在BBB</a>
											<img class="r-x-tou" src="" alt="" />
										</li>
										<!-- X2 -->
										<li>
											<h3>MMM</h3>
											<p class="i">
												<span></span>热度：12345
											</p>
											<a class="r-x-btn" href="">正在BBB</a>
											<img class="r-x-tou" src="" alt="" />
										</li>
									</ul>
								</div>
								
							</div>
							
							
							<div class="five-kuang">
								<h2>官方出品</h2>
								<div class="five-menu">
									<a class="mi-menu active" href="">壁纸</a>
									<a class="mi-menu active" href="">视频</a>
									<a class="mi-menu active" href="">音乐</a>
								</div>
								<!-- 壁纸 -->
								<div class="five-w">
									<ul class="five-list">
										<!-- 图片1 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片2 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片3 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片4 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片5 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片6 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片7 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
										<!-- 图片8 -->
										<li>
											<div class="five-tp">
												<img src="" alt="" />
											</div>
											<!-- 下载尺寸 -->
											<dl>
												<dd></dd>
												<dd></dd>
											</dl>
										</li>
									</ul>
									<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
								</div>
								
								<!-- 视频 -->
								<div class="five-video">
									<ul class="video-l">
										<!-- 视频1 -->
										<li>
											<img class="video-a" src="" alt="" />
											<span class="glyphicon glyphicon-step-forward" aria-hidden="true"></span>
										</li>
										<!-- 视频2 -->
										<li>
											<img class="video-a" src="" alt="" />
											<span class="glyphicon glyphicon-step-forward" aria-hidden="true"></span>
										</li>
									</ul>
									<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
									
									<!-- 音乐 -->
									<div class="music">
										<span>音乐名字</span>
										<span>开始时间</span>
										<span>结束时间</span>
										<div class="progress">
											<span class="bar">
												<i></i>
											</span>
										</div>
										<audio class="none" src="" loop=""></audio>
									</div>
									<div class="music-list">
										<ul>
											<!-- 音乐a -->
											<li>
												<a href="">
													<h4>音乐1</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
											<!-- 音乐b -->
											<li>
												<a href="">
													<h4>音乐2</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
											<!-- 音乐c -->
											<li>
												<a href="">
													<h4>音乐3</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
											<!-- 音乐d -->
											<li>
												<a href="">
													<h4>音乐4</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
											<!-- 音乐e -->
											<li>
												<a href="">
													<h4>音乐5</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
											<!-- 音乐f -->
											<li>
												<a href="">
													<h4>音乐6</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
											<!-- 音乐g -->
											<li>
												<a href="">
													<h4>音乐7</h4>
													<p>介绍<br />演唱：KKK</p>
												</a>
											</li>
										</ul>
									</div>
									<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
	</body>
	
	
	<!-- bootstrap4 -->
	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
	 crossorigin="anonymous"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
	 crossorigin="anonymous"></script>
	<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
	 crossorigin="anonymous"></script>

	<script type="text/javascript">
		$(function() {
			var a_f = $('.header-navigation nav a:first');
			var xx = a_f.position().left;
			var w = a_f.width();
			console.log(xx);
			console.log(w);
			$("#flag").css("left", xx + w / 2 + 14 + "px");
		});

		function checkFlag(a) {
			var a_j = $(a);
			var xx = a_j.position().left;
			var w = a_j.width();
			$("#flag").css("-webkit-transition", "0.3s");
			$("#flag").css("transition", "0.3s");
			$("#flag").css("left", xx + w / 2 + 14 + "px");
		}

		function dropDown() {
			$(".top_list").show();
		}

		function out() {
			$(".top_list").hide();
		}
		
		
		
		
		
		
		
		//职业一级导航动画
		    // $('.tab-hd', '.g-role').on('click', '.js-a', function () {
		    //     $(this).addClass('active').siblings().removeClass('active');
		    //     var i = $('.tab-hd .js-a', '.g-role').index(this);
		    //     $('.sub-tab-hd .role-nav', '.g-role ').eq(i).show(0).siblings('.role-nav').hide();
		    //     console.log(i)
		    // })
		    // //职业二级导航动画
		    // $('.sub-tab-hd', '.g-role').on('click', 'a', function () {
		    //     var i = $('.sub-tab-hd a', '.g-role').index(this);
		    //     $('.sub-tab-hd .active', '.g-role').removeClass('active');
		    //     $(this).addClass('active');
		    //     $('.sub-tab-bd .role', '.g-role').eq(i).show().siblings('.role').hide();
		    // })
		
		    //首页	
		    //gm专栏 活动中心
		    //p.BoxSwitch('.g-row-2 .m-right .clo-2', '.hd', 'a', '.bd img', 300);
		
		
		    //职业一级导航动画
		//     p.BoxSwitch('.g-row-3', '.tab-hd', 'a', '.sub-tab-hd .role-nav', 300);
		
		//     //职业二级导航动画
		//     p.BoxSwitch('.g-row-3', '.sub-tab-hd', 'a', '.sub-tab-bd  .role', 0);
	</script>
</html>
